<script setup lang="ts">
import RobotAvatar from '~/assets/img/robot-avatar.png';

defineProps<{
    link?: string,
    title?: string,
    content?: string,
}>();
</script>

<template>
    <NuxtLink class="relative p-1 w-full h-16 shadow-around shadow-theme overflow-hidden hover:shadow-element rounded-md border-2 border-white 
                bg-gradient-to-br to-white flex gap-2" :to="link" active-class="from-element/50">
        <img class="h-full aspect-square rounded" :src="RobotAvatar" />
        <div class="overflow-hidden">
            <div class="truncate text-lg">{{ title || 'New Chat' }}</div>
            <div class="text-slate-500 truncate">{{ content || 'No Content.' }}</div>
        </div>
    </NuxtLink>
</template>